<template>
	<div>
	<!--输入框部分-->
	<div class="p_Login_input">
		<span class="p_Login_input1">
       		<input type="text"  placeholder="手机号/邮箱/用户名/门店会员卡号" v-model="arr" />
       	</span>
		<br />
		<span class="p_Login_input2">
       		<input type="text" placeholder="请输入密码" v-model="psw"/>
       		<img src="../../../assets/login/显示.png"/>
       	</span>
		<div class="p_Login_zhuce">
			<a href="#/user">手机号快速注册</a>
			<a href="#/mima">找回密码</a>
		</div>
		<a @click="getuser()" class="sp">
			<button class="p_Login_denglu">登录</button>
		</a>
	</div>
	</div>
</template>

<script>

	export default {
		name: "userzhuce",
		data() {
			return {
				arr: "",
				arr1:"",
				psw: '',
				href: '#/usergeren',
			}
		},
		methods: {
			getuser: function() {
				var _this = this;
				var arr1 = /^((1[3,5,8][0-9])|(14[5,7])|(17[0,6,7,8])|(19[7]))\d{8}$/;
				if(!arr1.test(_this.arr)) {
					console.log("请输入正确的手机号");
					return false;
			}   else { //发送请求
					//获取数据					
						_this.axios.get('http://localhost:3000/router/select', {
							params: {
								phone: _this.arr,
								psw: _this.psw,
								condition: _this.sql.user.select
							}
						}).then(function(res) {
							console.log(111)
							if(res.data.length) {
								//缓存数据
								var obj = {
									phone:_this.arr,
									psw: 123
								}
								var arry = [];
								arry.push(obj);
								localStorage.setItem('obj',JSON.stringify(arry));
								window.location.href = _this.href;
							}else{
								console.log('请先去注册')
							}
						})

				}
			}

		}
	}
</script>

<style scoped>
	.p_Login_input {
		margin: 10% auto;
		width: 80%;
	}
	
	.p_Login_input1 {
		display: block;
		width: 100%;
		padding-bottom: 3%;
		border-bottom: 1px solid #999;
		background: url(../../../assets/login/手机.png)no-repeat 0 5px;
	}
	
	.p_Login_input1 input {
		margin-left: 20px;
		border: none;
		outline: none;
		width: 92%;
		height: 20px;
		color: #999;
		background: url(../../../assets/login/叉掉.png) no-repeat 100% 2px;
	}
	
	.p_Login_input2 input {
		margin-left: 20px;
		border: none;
		outline: none;
		width: 83%;
		height: 20px;
		color: #999;
		background: url(../../../assets/login/叉掉.png)no-repeat 90% 4px;
	}
	
	.p_Login_input2 {
		width: 100%;
		padding-bottom: 3%;
		border-bottom: 1px solid #999;
		display: block;
		background: url(../../../assets/login/锁.png)no-repeat 0 5px;
	}
	
	.p_Login_input2 img {
		vertical-align: bottom;
	}
	
	.p_Login_zhuce {
		margin-top: 5%;
		display: flex;
		justify-content: space-between;
	}
	
	.p_Login_zhuce a {
		font-size: 0.8rem;
		color: cornflowerblue;
		text-decoration: none;
	}
	
	.p_Login_denglu {
		margin-top: 8%;
		width: 100%;
		height: 40px;
		background-color: rgb(255, 129, 173);
		border-radius: 20px;
		border: none;
		outline: none;
		color: white;
	}
	
	.sp {
		cursor: pointer;
	}
</style>